<template>
  <div>
    <HighModal
      :isShow="isShow"
      @setIsShow="e=>closeMoadl(e)"
      :title="'生成JSON'"
      :styleObj="{top: '40px'}"
      :isShowFoot="false"
      :footSlot="true"
    >
      <template>
        <div class="fs14 pt30 pl30 pr30 pb30 none rel" style="width:1200px;height:70vh;">
          <pre
            v-if="formHtml"
            class="bgf abs trbl0 rds5"
            :spellcheck="false"
            style="left:30px;right:30px;top:20px;bottom:22px;border:1px solid #ccc;"
          >
            <div id="exportJsonId" :contenteditable="true" @input="changeExportJson" v-html="formHtml" class="pl10 pr10 pt10 pb10 abs trbl0 ovya" style="outline:none;"></div>
          </pre>
          <div v-else class="abs trbl0 bgf rds5 mt20 mb20"  style="left:30px;right:30px;border:1px solid #ccc;">
            <div class="fs18 g9 abs t50 l50 txy-50">暂无数据</div>
          </div>
        </div>
      </template>
      <template v-slot:footer>
        <div class="f ac xe pt10 pl10 pr15 pb10 rds5" style="background:#f5f7fa;border-radius:0 0 5px 5px;">
          <div @click.stop="closeMoadl(false)" class="g1aada7 poi mr20 rds4 f ac xc fs14" style="border:1px solid #1aada7;width:100px;height:32px;">关闭</div>
          <div v-if="formHtml" @click.stop="copyJson" class="gf poi mr10 rds4 f ac xc fs14" style="background:#1AADA7;border:1px solid #1aada7;width:100px;height:32px;">全部复制</div>
        </div>
      </template>
    </HighModal>
  </div>
</template>
<script src='./index.js'></script>
<style src='./index.css' scoped></style>